<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2022/11/2
  Time: 11:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<!-- header section start-->
<div class="header-section">

    <a class="toggle-btn"><i class="fa fa-bars"></i></a>

    <form class="searchform">
        <label for="searchIpt" style="display: none"></label>
        <input id="searchIpt" type="text" class="form-control" name="keyword" placeholder="查询内容..."/>
    </form>

    <!--notification menu start -->
    <div class="menu-right">
        <ul class="notification-menu">
            <li>
                <a href="#" class="btn btn-default dropdown-toggle info-number" data-toggle="dropdown">
                    <i class="fa fa-tasks"></i>
                    <span class="badge">8</span>
                </a>
                <div class="dropdown-menu dropdown-menu-head pull-right">
                    <h5 class="title">您有8个待定任务</h5>
                    <ul class="dropdown-list">
                        <li class="notification-scroll-list notification-list ">
                            <!-- list item-->
                            <a href="javascript:void(0);" class="list-group-item">
                                <div class="media">
                                    <div class="pull-left p-r-10">
                                        <em class="fa  fa-shopping-cart noti-primary"></em>
                                    </div>
                                    <div class="media-body">
                                        <h5 class="media-heading">已下新订单。</h5>
                                        <p class="m-0">
                                            <small>29分钟前</small>
                                        </p>
                                    </div>
                                </div>
                            </a>

                            <!-- list item-->
                            <a href="javascript:void(0);" class="list-group-item">
                                <div class="media">
                                    <div class="pull-left p-r-10">
                                        <em class="fa fa-check noti-success"></em>
                                    </div>
                                    <div class="media-body">
                                        <h5 class="media-heading">数据库备份已完成</h5>
                                        <p class="m-0">
                                            <small>12分钟前</small>
                                        </p>
                                    </div>
                                </div>
                            </a>

                            <!-- list item-->
                            <a href="javascript:void(0);" class="list-group-item">
                                <div class="media">
                                    <div class="pull-left p-r-10">
                                        <em class="fa fa-user-plus noti-info"></em>
                                    </div>
                                    <div class="media-body">
                                        <h5 class="media-heading">已注册新用户</h5>
                                        <p class="m-0">
                                            <small>17分钟以前</small>
                                        </p>
                                    </div>
                                </div>
                            </a>

                            <!-- list item-->
                            <a href="javascript:void(0);" class="list-group-item">
                                <div class="media">
                                    <div class="pull-left p-r-10">
                                        <em class="fa fa-diamond noti-danger"></em>
                                    </div>
                                    <div class="media-body">
                                        <h5 class="media-heading">数据库错误</h5>
                                        <p class="m-0">
                                            <small>11分钟以前</small>
                                        </p>
                                    </div>
                                </div>
                            </a>

                            <!-- list item-->
                            <a href="javascript:void(0);" class="list-group-item">
                                <div class="media">
                                    <div class="pull-left p-r-10">
                                        <em class="fa fa-cog noti-warning"></em>
                                    </div>
                                    <div class="media-body">
                                        <h5 class="media-heading">新设置</h5>
                                        <p class="m-0">
                                            <small>18分钟以前</small>
                                        </p>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="last"><a href="#">查看所有通知</a></li>
                    </ul>
                </div>
            </li>

            <li>
                <a href="#" class="btn btn-default dropdown-toggle info-number" data-toggle="dropdown">
                    <i class="fa fa-bell-o"></i>
                    <span class="badge">3</span>
                </a>
                <div class="dropdown-menu dropdown-menu-head pull-right">
                    <h5 class="title">通知</h5>
                    <ul class="dropdown-list normal-list">
                        <li class="message-list message-scroll-list">
                            <a href="#">
                                <span class="photo"> <img
                                        src="${pageContext.request.contextPath}/assets/images/users/avatar-8.jpg"
                                        class="img-circle" alt="img"></span>
                                <span class="subject">杰克</span>
                                <span class="message">需要完成新任务</span>
                                <span class="time">15分钟以前</span>
                            </a>

                            <a href="#">
                                <span class="photo"> <img
                                        src="${pageContext.request.contextPath}/assets/images/users/avatar-7.jpg"
                                        class="img-circle" alt="img"></span>
                                <span class="subject">张三</span>
                                <span class="message">需要完成新任务</span>
                                <span class="time">10分钟以前</span>
                            </a>

                            <a href="#">
                                <span class="photo"> <img
                                        src="${pageContext.request.contextPath}/assets/images/users/avatar-6.jpg"
                                        class="img-circle" alt="img"></span>
                                <span class="subject">李四</span>
                                <span class="message">需要完成新任务</span>
                                <span class="time">20分钟以前</span>
                            </a>
                        </li>
                        <li class="last"><a href="#">所有信息</a></li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                    <img src="${pageContext.request.contextPath}/assets/images/users/avatar-6.jpg" alt=""/>
                    杰克
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu dropdown-menu-usermenu pull-right">
                    <li><a href="#"> <i class="fa fa-wrench"></i> 设置 </a></li>
                    <li><a href="#"> <i class="fa fa-user"></i> 关于 </a></li>
                    <li><a href="#"> <i class="fa fa-info"></i> 帮助 </a></li>
                    <li><a href="#"> <i class="fa fa-lock"></i> 退出 </a></li>
                </ul>
            </li>

        </ul>

    </div>
    <!--notification menu end -->

</div>
<!-- header section end-->

